.my-button {
  padding: 6px 16px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 16px;
}

.my-button-primary {
  background-color: #1677ff;
  color: white;
}
.my-button-primary:hover {
  background-color: #4096ff;
  transition: 0.5s;
}
.my-button-primary:active {
  background-color: #0958d9;
}
.my-button-success {
  background-color: #52c41a;
  color: white;
}
.my-button-success:hover {
  background-color: #95de64;
  transition: 0.5s;
}
.my-button-success:active {
  background-color: #389e0d;
}
.my-button-warning {
  background-color: #fa8c16;
  color: white;
}
.my-button-warning:hover {
  background-color: #ffd666;
  transition: 0.5s;
}
.my-button-warning:active {
  background-color: #d48806;
}
.my-button-danger {
  background-color: #f5222d;
  color: white;
}
.my-button-danger:hover {
  background-color: #ff7875;
  transition: 0.5s;
}
.my-button-danger:active {
  background-color: #d9363e;
}
